<template>
	<view class="">
		<view class="title">
			{{title}}
		</view>
		<view class="timenaum">
			<view class="name">
				{{author}}
			</view>

		</view>
		
		<view class="line"></view>

		<!-- <rich-text :nodes="htmlNodes"></rich-text> -->
		<u-parse :content="htmlNodes" noData=" " @preview="preview" @navigate="navigate" ></u-parse>
		<view class="num">
			阅读数:{{num}}次
		</view> 
	</view>
</template>

<script>
	import uParse from '@/components/u-parse/u-parse.vue';
	export default{
		components: {
		    uParse
		},
		data(){
			return{
				htmlNodes:'',
				title:'',
				time:'',
				num:'',
				author:''
			}
		},
		onLoad(options) {
			this.getarticle(options.id)
		},
		methods:{
			getarticle(id){
				uni.showLoading({
					title:"加载中"
				})
				this.$api.interfaceApi('getArticle')({
					id:id
				}).then(res=>{
					this.htmlNodes = res.data.content
					this.title = res.data.title
					this.time = res.data.time
					this.num = res.data.see_num
					this.author = res.data.author
					uni.hideLoading()
				})
			},
			preview(src, e) {
			      // do something
			},
			navigate(href, e) {
			    // do something
			},
			
		}
	}
</script>

<style>
	@import url("@/components/u-parse/u-parse.css");
	body{
		padding: 20rpx;
		box-sizing: border-box;
	}
	.title{
		font-size: 36rpx;
		font-weight: 600;
		color: #333333;
		margin-bottom: 10rpx;
	}
	.timenaum{
		display: flex;
		margin-bottom: 10rpx;
	}
	.num{
		color: #666666;
		margin-top: 30rpx;
	}
	.timenaum .name{
		color: #007AFF;
		margin-right: 10rpx;
	}
	.timenaum .time{
		color: #666666;
	}
	.line{
		width: 100%;
		border: 1rpx solid #afafaf;
		margin-bottom: 20rpx;
	}
</style>
